import { Dict, DictType, getDictList } from "@/utils/cacheUtil";
import { defineComponent } from "vue";
import "./status.scss";
export default defineComponent({
	props: {
		modelValue: [String, Boolean, Number]
	},
	emits: [],
	setup(props) {
		const typeList = ref([] as Dict[]);
		const colorType = {
			algo: "#5E7CE0", //算法
			middleware: "#008000", //中间件
			general: "#008000", //业务系统
			system: "#ff0000" //系统服务d
		} as { [key: string]: string };
		const defaultColor = "#5E7CE0";
		onMounted(() => {
			initPage();
		});
		const initPage = () => {
			getDictList(DictType.AppletType).then(list => {
				typeList.value = list;
			});
		};
		const getBody = () => {
			let info = typeList.value.find(item => item.key == props.modelValue);

			return (
				// <span class="status-info">
				// 	<span class="dot" style={{ background: colorType[props.modelValue + ""] || "orange" }} />
				// 	<span>{info?.label || props.modelValue}</span>
				// </span>
				<span
					class="font-12 pl-2 pr-2 pt-1 pb-1"
					style={{ background: (colorType[props.modelValue + ""] || defaultColor) + "20", borderRadius: "4px" }}
				>
					<span style={{ color: colorType[props.modelValue + ""] || defaultColor }}>{info?.label || props.modelValue}</span>
				</span>
			);
		};
		return () => {
			return getBody();
		};
	}
});
